<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>字体颜色属性</title>

    <style>
        /*颜色名称*/
        .one{
            color: tomato;
        }

        /*十六进制模式*/
        .two{
            color: #00ff00;
        }

        /*RGB模式*/
        .three{
            color: rgb(0,255,255);
        }

        /*RGBA模式   在rgb模式上增加了透明度,透明度的取值范围是0到1 */
        .four{
            color: rgba(0,255,0,0.7);
        }

        /*hsl模式 色环模式*/
        .five{
            color: hsl(180deg,100%,50%);
        }

        /*hsla模式  色环 透明度模式*/
        .six{
            color: hsla(180deg,100%,50%,0.3);
        }

        /*透明模式*/
        .seven{
            color: transparent;
        }

        /*设置字体样式 italic斜体    normal正常体    */
        .italic{
            font-style: italic;
        }

    </style>

</head>
<body>
    <p class="one">我是颜色名称</p>
    <p class="two">我是十六进制</p>
    <p class="three">我是RGB模式</p>
    <p class="four">我是RGBA模式</p>
    <p class="five">我是CSS3中新增HSL模式</p>
    <p class="six">我是CSS3中新增HSLA模式</p>
    <p class="seven">我是CSS3中透明色</p>
    <p class="italic">我是字体样式</p>
</body>
</html>